<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>通用惰性单例</title>
</head>
<body>
    <button id="loginBtn">登录</button>
    <button id="loadIframe">加载百度</button>
    <script>
        /*
         * 把创建单例和管理单例的职责分离开来
         */
        var getSingle = function (fn) {
            var result;
            return function () {
                return result || (result = fn.apply(this,arguments));
            };
        };

        var createLoginLayer = function () {
            var div = document.createElement('div');
            div.innerHTML = '登录浮框';
            div.style.display = 'none';
            document.body.appendChild(div);
            return div;
        }

        var createSingleLoginLayer = getSingle(createLoginLayer);

        document.getElementById('loginBtn').onclick = function () {
            var loginLayer = createSingleLoginLayer();
            loginLayer.style.display = 'block';
        }

        var createSingleIframe = getSingle(function () {
            var iframe = document.createElement('iframe');
            document.body.appendChild(iframe);
            return iframe;
        });

        document.getElementById('loadIframe').onclick = function () {
            var iframe = createSingleIframe();
            iframe.src="http://m.baidu.com/";
        }




    </script>
</body>
</html>